<!--
 * @Description: 
 * @Version: 
 * @Author: 学渣小明
 * @Date: 2022-05-03 11:19:47
 * @LastEditors: 学渣小明
 * @LastEditTime: 2022-05-03 12:15:16
-->
<div id="fragment-index-hot-search" data-num="10">
    <div class="title">
      <h2 class="title_h2">
        <i class="title-line"></i>
        <a class="title_link" href="javascript:">热搜榜</a>
      </h2>
    </div>
    <ul class="tab-list">
        <li class="active">日</li>
        <li>周</li>
        <li>月</li>
    </ul>
    <ul class="bid-list">
    </ul>
    <div class="look-all">
        <a href="javascript:">查看完整榜单 <i class="iconfont icon-xiala1"></i></a>
    </div>
</div>
<script>
    $(function () {
        function getloadChannelHotSearchData(type) {
            var data = {
                plateId: 101,
                pageNum: 1,
                pageSize: $('#fragment-index-hot-search').data('num'),
                queryType: type
            };
            $.ajax({
                url: ports.loadChannelHotSearchData,
                data: data,
                success: function (res) {
                    console.log('获取热搜榜数据',res)
                    var html = '';
                    var list = res.data.list;

                    $.each(list,function (i,item) {
                        html += '<li>\n' +
                            '            <h3><a target="_blank" href='+ (item.articleOutLinkStatus?item.articleOutLink:item.articleUrl) +'>\n' +
                            item.articleTitle +
                            '            </a></h3>\n' +
                            '        </li>'
                    });
                    $('#fragment-index-hot-search .bid-list').html(html);
                }
            })
        }
        getloadChannelHotSearchData(1);

        var $aTabLi = $('#fragment-index-hot-search ul.tab-list>li');
        $aTabLi.click(function () {
            $aTabLi.removeClass('active')
            $(this).addClass('active');
            getloadChannelHotSearchData($(this).index()+1);
        });
    })
</script>